import React from 'react';
import { Tabs } from 'antd';
import { useHistory } from 'react-router-dom';
import styles from './index.less';

const Demos = (props) => {
  const history = useHistory();
  const tabs = [
    {
      key: 'update',
      tab: 'update',
    },
  ];
  return (
    <div className={styles.container}>
      <Tabs onChange={(key) => history.push(`/demos/${key}`)}>
        {tabs.map((tab) => (
          <Tabs.TabPane tab={tab.tab} key={tab.key} />
        ))}
      </Tabs>
      {props.children}
    </div>
  );
};
export default Demos;
